const sw = 15, sh = 15, tr = 30, td = 30;

function square(x, y, name) {
    this.left = x * sw;
    this.top = y * sh;
    this.viewcontent = document.createElement("div");
    this.parent = document.querySelector(".content");
    this.creat = function () {
        this.viewcontent.className = name;
        this.viewcontent.style.left = this.left + "px";
        this.viewcontent.style.top = this.top + "px";
        this.parent.appendChild(this.viewcontent);
    }
    this.remove = function () {
        this.parent.removeChild(this.viewcontent);
    }
}


function getsnake() {
    this.head = null;
    this.pos = [];
    this.arr = [];
    this.direction = {
        front: [1, 0],
        back: [-1, 0],
        up: [0, -1],
        down: [0, 1],
        one: [-1, 1],
        three: [1, 1],
        seven: [-1, -1],
        nine: [1, -1]
    };
    // this.target = null;
    this.init = function () {
        var header = new square(2, 0, "head");
        header.creat();
        this.pos.push([header.left / sw, header.top / sh]);
        this.arr.push(header);
        this.head = header;
        // header.last = null;
        // header.next = body1;

        var body1 = new square(1, 0, "body");
        body1.creat();
        this.pos.push([body1.left / sw, body1.top / sh]);
        this.arr.push(body1);
        // body1.last = header;
        // body1.next = body2;

        var body2 = new square(0, 0, "body");
        body2.creat();
        this.pos.push([body2.left / sw, body2.top / sh]);
        this.arr.push(body2);
        // this.tail = body2;
        // body2.last = body1;
        // body2.next = null;

        this.target = this.direction.front;
    }
    this.getnextpos = function () {
        this.nextpos = [
            this.head.left / sw + this.target[0],
            this.head.top / sh + this.target[1]
        ];
        //撞到自己
        var selfdie = false;
        this.pos.forEach(element => {
            if (element[0] == this.nextpos[0] &&
                element[1] == this.nextpos[1]) {
                selfdie = true;
            }
        });
        if (selfdie == true) {
            console.log("撞到自己了");
            game.gameover();
            return;
        };

        //超出范围
        if (this.nextpos[0] < 0 || this.nextpos[0] > 29
            || this.nextpos[1] < 0 || this.nextpos[1] > 29) {
            console.log("撞墙了");

            game.gameover();
            return;
        };
        //吃苹果

        //移动
        this.move();

    }
    this.move = function () {
        var newbody = new square(this.pos[0][0], this.pos[0][1], "body");
        newbody.creat();
        this.arr.splice(0, 1, newbody);
        // newbody.next = this.head.next;
        this.head.remove();


        var newhead = new square(this.nextpos[0], this.nextpos[1], "head");
        newhead.creat();
        this.pos.splice(0, 0, [newhead.left / sw, newhead.top / sh]);
        this.arr.splice(0, 0, newhead);
        this.head = newhead;
        // console.log(this.head);
        // newbody.last = newhead;
        // newhead.last = null;
        // newhead.next = newbody;


        if (this.pos[0][0] == food.x && this.pos[0][1] == food.y) {
            game.score += 10;
            food.foods.remove();
            food.addfood();
        } else {
            this.arr[this.arr.length - 1].remove();
            this.arr.pop();
            this.pos.pop();
        }
    }
}



function creatfood() {
    this.x = null;
    this.y = null;
    this.foods = null;
    this.addfood = function () {
        while (true) {
            this.x = Math.ceil(Math.random() * 28);
            this.y = Math.ceil(Math.random() * 28);
            var flag = 0;
            for (var i = 0; i < snake.pos.length; i++) {
                if (this.x != snake.pos[i][0] || this.y != snake.pos[i][1]) {
                    flag = flag + 1;
                }
            };
            if (flag = snake.pos.length) {
                break;
            };
        };
        this.foods = new square(this.x, this.y, "food");
        this.foods.creat();
    }
}
var abs = 1;
var snake = new getsnake;
var food = new creatfood;
function gamecontrol() {
    this.init = function () {
        this.timer = null;
        this.score = 0;
        snake.init();
        food.addfood();
        console.log("执行");
        this.startgame();
        document.onkeydown = function (ev) {
            if (ev.which == 98 && snake.target != snake.direction.up) {
                snake.target = snake.direction.down;
            }
            if (ev.which == 100 && snake.target != snake.direction.front) {
                snake.target = snake.direction.back;
            }
            if (ev.which == 102 && snake.target != snake.direction.back) {
                snake.target = snake.direction.front;
            }
            if (ev.which == 104 && snake.target != snake.direction.down) {
                snake.target = snake.direction.up;
            }
            if (ev.which == 97 && snake.target != snake.direction.nine) {
                snake.target = snake.direction.one;
            }
            if (ev.which == 99 && snake.target != snake.direction.seven) {
                snake.target = snake.direction.three;
            }
            if (ev.which == 103 && snake.target != snake.direction.three) {
                snake.target = snake.direction.seven;
            }
            if (ev.which == 105 && snake.target != snake.direction.one) {
                snake.target = snake.direction.nine;
            }

            if (ev.keyCode == 101) {
                if (abs == 1) {
                    console.log("暂停");
                    clearInterval(game.timer)
                    game.timer = null;
                    abs = 0;
                    console.log(abs);
                } else {
                    console.log("继续");
                    game.startgame();
                    abs = 1;
                    console.log(abs);
                }
            }

        }


    }
    this.startgame = function () {
        console.log("开始");
        this.timer = setInterval(function () {
            snake.getnextpos();
        }, 220)

    }
    this.gameover = function () {
        clearInterval(this.timer);
        alert("分数为" + game.score);
        var content = document.querySelector(".content");
        content.innerHTML = "";
        snake = null;
        food = null;
        snake = new getsnake;
        food = new creatfood;
        btn.style.display = "block";
    }
}
var game = new gamecontrol;
var btn = document.querySelector(".btn")
btn.addEventListener("click", function () {
    game.init();
    btn.style.display = "none";
})
